<template>
  <!-- 修改资料 -->

  <div>
    <el-form
      :model="form"
      label-position="right"
      ref="formRef"
      :rules="formRules"
    >
        <el-row :gutter="15">
          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
            <el-form-item label="编号" required>
              <el-input v-model="form.number"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
            <el-form-item label="名称" required>
              <el-input v-model="form.name"></el-input>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
            <el-form-item label="运输方式" :required="true">
              <el-select
                v-model="form.transportMode"
                clearable
                placeholder="请选择："
              >
                <el-option
                  v-for="item in configData.transportModeList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
            <el-form-item label="计价方式" required>
                <el-select
                v-model="form.priceKind"
                clearable
                placeholder="请选择："
              >
                <el-option
                  v-for="item in configData.priceKindList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
            <el-form-item label="是否包邮" required>
              <el-switch v-model="form.freeShipping"></el-switch>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
            <el-form-item label="默认运费" required>
                <el-input-number v-model="form.freight"/>
            </el-form-item>
          </el-col>
              <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
                <el-form-item label="状态" prop="status">
                  <el-switch
                    v-model="form.status"
                    inline-prompt
                    active-value="normal"
                    inactive-value="disable"
                  />
                </el-form-item>
              </el-col>
              <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
                <el-form-item label="备注">
                  <el-input v-model="form.remark"></el-input>
                </el-form-item>
              </el-col>
        </el-row>
    </el-form>
    <!-- </template> -->
    <!-- <template #footer> -->
    <div class="button-position">
      <el-button @click="updateVisible">取 消</el-button>
      <el-button type="primary" @click="addFreight(formRef)">确 定</el-button>
    </div>
    <!-- </template> -->

    <!-- </myDialog> -->
  </div>
</template>
  
  
  <script setup>
import { reactive, ref, onMounted } from "vue";
import { ElNotification } from "element-plus";
import Api from "@/api/model/mall";
import tsSelect from "@/components/scSelect/index.vue";
const emit = defineEmits(["updatetable"]);
const props = defineProps({
  paramsData: {
    type: Object,
    defalut: {},
  },
});

// 添加用户数据的对象
const form = ref({});
const remark = ref();
const configData = ref([]);
const formRef = ref();
onMounted(() => {
  getInit();
});

const updateVisible = () => {
  emit("updatetable");
};

const getInit = async () => {
  let res = await Api.freight.add.post();
  if (res.code == "200") {
    configData.value = res.configData;
    form.value = res.data;
  }
};
const restAddFormData = () => {
  formRef.value.resetFields();
};

// 上传
const addFreight = async (formRef) => {
  await formRef.validate((valid, fields) => {
    if (valid) {
      addFreightData();
    }
  });
};

const addFreightData = async () => {
  var params = {
    bean: form.value,
  };

  var res = await Api.freight.save.post(params);
  console.log(res);
  if (res.code == 200) {
    restAddFormData();
    ElNotification.success({
      title: "",
      message: "添加成功！",
      duration: 2000,
    });
    emit("updatetable", true);
  }
};
</script>
  
  <style scoped></style>
  
  